<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        .button{
                cursor: pointer;
                border: 1px solid #0046ff;
                width: 100px;
                border-radius: 5px;
                text-align: center;
        }
    </style>
</head>
<body>
<h1>day1</h1>
<h3>js特殊字符转义</h3>
    <form>
        <textarea type="text" id="reason"/><这是书！>"这是引用'</textarea>
    </form>
    <div onclick="checkData()" class="button">提交</div><br>
    <div onclick="getData()" class="button">拿出内容</div><br>
<div id="getData"></div>
<h3>tab转换内容</h3>
    <input  class="radio" type="radio" name="object" value="0" />1
    <input  class="radio" type="radio" name="object" value="1" />2
    <input  class="radio" type="radio" name="object" value="2" />3
    <span   id="id1"    style="display:none;">内容1</span>
    <span   id="id2"    style="display:none;">内容2</span>
    <span   id="id3"    style="display:none;">内容3</span>
</body>
<script>
    // function checkData(v) {
    //     var  entry = { "'": "&apos;", '"': '&quot;', '<': '&lt;', '>': '&gt;' };
    //     v = v.replace(/(['")-><&\\\/\.])/g, function ($0) { return entry[$0] || $0; });
    //     return v;
    // }
    // function getValue(){
    //     var x = document.getElementById("reason");
    //     var v = checkData(x.value);
    //     alert(v);
    // }

    //new less code

    // change character
    var reason;

    function checkData(){
        reason=document.getElementById("reason").value;//获取退款理由内容
        var  entry = { "'": "&apos;", '"': '&quot;', '<': '&lt;', '>': '&gt;' };
        reason = reason.replace(/(['")-><&\\\/\.])/g, function ($0) { return entry[$0] || $0; });
        alert(reason);
    }

    function getData(){
        document.getElementById('getData').innerHTML=reason;
    }

    // tab
    window.onload = function() {
        var radios = document.getElementsByName('object');
        for (var i = 0; i < radios.length; i++){
            radios[i].indexs = i + 1;
            radios[i].onchange = function(){
                if (this.checked) {
                    document.getElementById("id1").style.display="none";
                    document.getElementById("id2").style.display="none";
                    document.getElementById("id3").style.display="none";
                    document.getElementById("id" + this.indexs).style.display="block";
                } 
            }
        }
    }
</script>
</html>